<!-- @format -->

<template>
    <div class="layout">
        <!-- <aside>
            <RouterLink to="/home" active-class="active">首页</RouterLink>

            <br />
            <RouterLink to="/vue3Study" active-class="active" replace>vue3学习</RouterLink>
        </aside>
        <div class="layout-right">

        </div> -->
        <FixedHeader />
        <Header />
        <!-- <div class="main-content"> -->

        <RouterView />
        <!-- </div> -->
        <!-- <Footer /> -->
    </div>
</template>
<script setup lang="ts">
// import {Nav, Footer} from './components/index';
import Header from './components/header.vue';
// import Footer from './components/footer.vue';
import FixedHeader from './components/fixedHeader.vue';
import {RouterView} from 'vue-router';
// import {useUserStore} from '@/store/user';

// const userStore = useUserStore();
</script>
<style scoped>
.layout {
    width: 100%;
    height: 100vh;
    background-color: #e0e0e0;
    /* /* height: 100vh;  */
    /* overflow: hidden; */
    /* display: flex; */
    /* background: #c6ffdd; /* fallback for old browsers */
    /* background: -webkit-linear-gradient(to bottom, #f7797d, #fbd786, #c6ffdd); /* Chrome 10-25, Safari 5.1-6 */
    /* background: linear-gradient(
        to bottom,
        #f7797d,
        #fbd786,
        #c6ffdd
    );  */
}

.layout aside a.active {
    color: orange;
}
</style>
